<template>
  <div class="orderquery">
    <div style="margin:0 0 20px 0">会员卡号：{{customernumber.customerCard}}</div>
    <el-button style="margin:0 0 10px 95%" type="primary" size="mini" @click="returntop">返回</el-button>
    <!-- 表格 -->
    <div style="bottom">
      <el-table :data="detalist" border size="mini" :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }">
        <el-table-column prop="orderId" label="订单号" width="100">
        </el-table-column>
        <el-table-column prop="eLongOrderId" label="渠道订单号" width="110">
        </el-table-column>
        <el-table-column prop="hotelName" label="酒店名称"> </el-table-column>
        <el-table-column prop="orderVersion" label="版本号" width="80">
        </el-table-column>
        <el-table-column prop="employeeName" label="入住人姓名" width="110">
        </el-table-column>
        <el-table-column prop="contactName" label="联系人" width="110">
        </el-table-column>
        <el-table-column prop="guestName" label="预定员" width="110">
        </el-table-column>
        <el-table-column prop="orderFlowStatusId" label="订单流程状态" width="110">
        </el-table-column>
        <el-table-column prop="orderStatusId" label="订单大状态" width="110">
        </el-table-column>
        <el-table-column prop="payWay" label="支付方式" width="110">
        </el-table-column>
        <el-table-column prop="plusMoneyStatus" label="支付状态" width="110">
          <template slot-scope="scope">
            <template v-if="scope.row.plusMoneyStatus == 'waitPay'">等待支付</template>
            <template v-if="scope.row.plusMoneyStatus == null">无</template>
            <template v-if="scope.row.plusMoneyStatus == 'payd'">支付成功</template>
            <template v-if="scope.row.plusMoneyStatus == 'cancelPay'">取消支付</template>
            <template v-if="scope.row.plusMoneyStatus == 'failPay'">失败支付</template>
          </template>
        </el-table-column>
        <el-table-column prop="arriveTime" label="入住时间" width="110">
        </el-table-column>
        <el-table-column prop="checkOutTime" label="离店时间" width="110">
        </el-table-column>
        <el-table-column prop="createTime" label="预定时间" width="110">
        </el-table-column>
        <el-table-column prop="reserveTime" label="预定间夜" width="110">
        </el-table-column>
        <el-table-column prop="checkInTime" label="入住间夜" width="110">
        </el-table-column>
        <el-table-column prop="orderSourceTypeName" label="来源" width="90">
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
  import Vue from "vue";
  export default {
    name: "orderquery",
    data() {
      return {
        customerId: "",
        detalist: [],
        customernumber: {},
        currentPage: '',
        pageSize: ''
      };
    },
    props: {},
    components: {},
    methods: {
      // 返回
      returntop() {
        this.$router.go(-1)
      },
      // 会员卡号
      getinformation() {
        this.$axios.getinformation({
          id: this.customerId,
          // id:'77'
        }).then((res) => {
          console.log(res)
          this.customernumber = res.data
          if (res.code == 200) {
            this.conditionHotelOrder()
          }
        })
      },

      // 查询
      conditionHotelOrder() {
        localStorage.setItem("pageNum", this.currentPage);
        localStorage.setItem("pageSize", this.pageSize);
        this.$axios
          .getconditionHotelOrder({
            pagesNum: '',
            barsNum: '',
            // 会员卡号
            customerCard: '',
            // 预定员工号
            reserveEmployeeNum: '',
            // 会员名称
            customerName: '',
            // 联系人手机
            phone: this.customernumber.customerPhone,
            // 订单流程状态id
            orderFlowStatusId: '',
            // 订单大状态id
            orderStatusId: '',
            // 预定时间前
            reserveTimeForward: '',
            // 预定时间后
            reserveTimeBack: '',
            // 离店时间前
            leaveTimeForward: '',
            // 离店时间后
            leaveTimeBack: '',
            // 城市名称
            cityName: '',
            // 酒店名称
            hotelName: '',
            // 入住人姓名
            checkName: '',
            // 支付方式
            payWay: '',
            // 是否担保
            guarantee: '',
            // 入住时间前
            checkTimeForward: '',
            // 入住时间后
            checkTimeBack: '',
            // 订单来源id
            orderSource: '',
            // 渠道订单号
            channelOrderNumber: '',
            // 订单号
            orderNumber: '',
          })
          .then((res) => {
            console.log(res);
            if (res.code == "200") {
              this.detalist = res.data.hotelOrderListVo;
              console.log(this.detalist);
            }
          });
      },
    },
    mounted() {
      this.customerId = this.$route.params.customerId;
      this.getinformation()
    },
  };
</script>

<style scoped>
  .orderquery {
    margin: 20px;
  }
</style>